<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<style>

</style>
<body>
    <label>姓名:</label><input type="text" class="name" onchange="changeName()">
    <button onclick="changeInput()">恢复姓名为rose</button>
</body>
<script>
    //利用通过 Object.defineProperty()来实现简易的双向数据绑定
       //创建person对象
       var person = {
            name:''
        }
        function changeName(){
            //修改person对象中的name的值为输入框中的值
        }

         Object.defineProperty(person, 'name', {
             // 这里实现双向绑定，监听name值变化，input也跟着变化
        })

        function changeInput(){
            //按钮事件 修改person对象中的name的值为rose
        }
</script>
</html>